import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:rainflutter/Tools/dcp_pch.dart';

//发表评论
class DcpComments extends StatefulWidget {
  @override
  _DcpCommentsState createState() => _DcpCommentsState();
}

class _DcpCommentsState extends State<DcpComments>
    with SingleTickerProviderStateMixin {
  AnimationController _controller;
  int _strLength = 150;
  int _index = 0;
  @override
  void initState() {
    super.initState();
    _controller = AnimationController(vsync: this);
  }

  @override
  void didUpdateWidget(covariant DcpComments oldWidget) {
    super.didUpdateWidget(oldWidget);
  }

  @override
  void deactivate() {
    super.deactivate();
  }

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
  }

  @override
  void dispose() {
    super.dispose();
  }

  void changeState(String str) {
    setState(() {
      _strLength = 150 - str.length;
    });
  }

  void changeRaing(int index) {
    setState(() {
      _index = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('评论'),
        centerTitle: true,
        actions: <Widget>[
          FlatButton(
            child: Text('发表'),
            textColor: _index == 0
                ? Color.fromRGBO(255, 59, 48, 0.4)
                : Color(0xffff3b00),
            highlightColor: Colors.blue,
            splashColor: Colors.blue,
            onPressed: () {
              if (_index > 0) {
                // FocusScope.of(context).requestFocus(FocusNode());
                showToast('发表成功，请等待审核');
                Navigator.pop(context);
              }
            },
          ),
        ],
      ),
      backgroundColor: Colors.white,
      body: new Column(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.start,

        ///最外层包裹  16边距
        children: <Widget>[
          Container(
            padding: EdgeInsets.all(16),
            color: Colors.white,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.start,
              //白底色 评论框+tips
              children: <Widget>[
                Container(
                  height: 180,
                  // padding: EdgeInsets.only(bottom: 15),
                  color: Colors.white,
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.start,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      //创建上边的评论框
                      textField(),
                      //下边的tips富文本
                      tipsText(),
                    ],
                  ),
                ),

                ///星星打分
                raingView(),
              ],
            ),
          ),
        ],
      ),
    );
  }

  ///评论框
  Widget textField() {
    return Column(
      children: <Widget>[
        Container(
          height: 150,
          child: TextField(
            style: TextStyle(color: Color(0xff333333), fontSize: 14),
            maxLines: null,
            autofocus: true,
            inputFormatters: [LengthLimitingTextInputFormatter(null)],
            decoration: InputDecoration(
              hintText: '请输入内容',
              fillColor: Colors.red,
              border: InputBorder.none,
              hintStyle: TextStyle(color: Color(0xff999999), fontSize: 14),
            ),
            onChanged: (String str) {
              changeState(str);
            },
          ),
          decoration: BoxDecoration(
            color: Color(0xfff5f5f5),
            borderRadius: BorderRadius.circular(4.0),
          ),
        )
      ],
    );
  }

  ///富文本
  Widget tipsText() {
    return Column(
      children: <Widget>[
        Container(
          color: Colors.white,
          padding: EdgeInsets.only(top: 8.0, left: 8.0),
          child: new RichText(
            text: new TextSpan(
              text: '还可以输入',
              style: TextStyle(color: Color(0xff999999), fontSize: 12),
              children: <TextSpan>[
                new TextSpan(
                  text: '$_strLength',
                  style: TextStyle(color: Colors.red, fontSize: 12),
                ),
                new TextSpan(
                  text: '个字（评价需要等待1-3天审核）',
                  style: TextStyle(color: Color(0xff999999), fontSize: 12),
                ),
              ],
            ),
          ),
        ),
      ],
    );
  }

  Widget raingView() {
    return Column(
      children: <Widget>[
        Container(
            color: Colors.white,
            height: 30,
            padding: EdgeInsets.only(left: 5, top: 0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                raingBar(),
                raingText(),
              ],
            )),
      ],
    );
  }

  Widget raingBar() {
    return RatingBar(
      clickable: true,
      size: 27,
      color: Color(0xffff3b00),
      padding: 10,
      value: _index.toDouble(),
      onValueChangedCallBack: (value) {
        print(value);
        changeRaing(value.toInt());
      },
    );
  }

  Widget raingText() {
    var ary = [
      '',
      '差劲',
      '不满意',
      '一般',
      '满意',
      '非常满意',
    ];
    return Column(
      mainAxisAlignment: MainAxisAlignment.start,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Container(
          padding: EdgeInsets.only(top: 7, left: 8),
          child: Text(
            ary[_index.toInt()],
            style: TextStyle(color: Color(0xffff3b00), fontSize: 14),
          ),
        )
      ],
    );
  }

  // void showToast(String str) {
  //   Fluttertoast.showToast(
  //       msg: str,
  //       toastLength: Toast.LENGTH_LONG,
  //       gravity: ToastGravity.BOTTOM,
  //       timeInSecForIos: 2,
  //       backgroundColor: Color.fromARGB(200, 0, 0, 0),
  //       textColor: Colors.white);
  // }
}
